<template>
    <div class="addAddressShow">
      <el-row>
            <el-col :span="6">
                <div class="grid-content lh">收货人：</div>
            </el-col>
            <el-col :span="16">
                <div class="grid-content bg-purple-light">
                    <el-input v-model="userName" placeholder="请输入内容"></el-input>
                </div>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="6">
                <div class="grid-content lh">联系方式：</div>
            </el-col>
            <el-col :span="16">
                <div class="grid-content bg-purple-light">
                    <el-input v-model="telephone"  placeholder="请输入内容"></el-input>
                </div>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="6">
                <div class="grid-content lh">备注：</div>
            </el-col>
            <el-col :span="16">
                <div class="grid-content bg-purple-light">
                    <el-input v-model="types" placeholder="请输入内容"></el-input>
                </div>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="6">
                <div class="grid-content lh">所在城市：</div>
            </el-col>
            <el-col :span="16">
                <div class="grid-content bg-purple-light">
                    <el-input  v-model="citys" placeholder="请输入内容"></el-input>
                </div>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="6">
                <div class="grid-content lh">收货地址：</div>
            </el-col>
            <el-col :span="16">
                <div class="grid-content bg-purple-light">
                    <el-input v-model="address"  placeholder="请输入内容"></el-input>
                </div>
            </el-col>
        </el-row>
    <el-button type="primary" style="margin-left:410px;margin-bottom: 30px;"  @click="addAddress">提交</el-button>
    </div>
</template>
<script>
   export default {
    name: 'addaddress',
    data() {
      return {
        userName:'',
        telephone:'',
        address:'',
        types:'',
        citys:'',
        }
    },
    methods:{
      addAddress(){
          alert('begin addAddress')
            this.axios.post('/api/addAddress',{userName:this.userName,
              telephone:this.telephone,address:this.address,types:this.types,citys:this.citys})
            .then(res => {
                console.log('res:',res)
                if(res.data.message == 'ok'){
                  alert('添加成功！')
                  this.$router.push({path:'/personal/address'})
                }
        })
    }
  }
}
</script>
<style>
.addAddressShow{
    margin-left:11%;
}
</style>